import React from 'react';

import ListPage from '@common/listPage';
import { DemoType, ExampleType, ApiStatus } from '@/types.d';
import { createDemoType } from '@utils/typeHandler'

import setStyleAttributePreprocessor from './setStyleAttributePreprocessor';

const NAME = 'StyleSheet';
const CATEGORY = 'API';
const DESCRIPTION = 'StyleSheet';

const demoList: DemoType[] = [
    {
        name: 'setStyleAttributePreprocessor',
        description: t('api.StyleSheet.setStyleAttributePreprocessor.description'),
        component: setStyleAttributePreprocessor,
        apiStatus: ApiStatus.Experimental,
    },
].map((item) => {
    return createDemoType({ ...item, id: `${CATEGORY}_${NAME}_${item.name}` })
});



const Example: ExampleType['component'] = ({ navigation }) => {
    return (
        <>
            {ListPage({
                title: NAME,
                list: demoList,
                navigation
            })}
        </>
    )
}

const StyleSheetExample: ExampleType = {
    id: `${CATEGORY}_${NAME}`,
    name: NAME,
    description: DESCRIPTION,
    category: CATEGORY,
    component: Example,
    children: demoList,
}

export default StyleSheetExample;